import {nextTick, onMounted, ref, watch} from 'vue'
import {http} from "api/axios.js";
import html2canvas from "html2canvas";
import {ElMessage} from 'element-plus';
import {useRoute, useRouter} from "vue-router"
import {getVisibleElement} from "element-plus/es/components/focus-trap/index";

export function equipmentBuildsDetail() {
    const router = useRouter();
    const route = useRoute();
    const loading = ref(false);
    const goBack = () => {
        router.back()
    }
    const author = ref(route.query.username)
    //当前境界
    const currentRealm = ref({constitution: 577.35, coreAttribute: 1446.44, cultivationLevel: "筑基二", id: 3, spiritualRootLimit: 11610})
    const selectedBuild = ref()
    const detailData = ref()
    const result = ref({//物理防御
        physicalDefense: 0,
        //法术防御
        magicDefense: 0,
        //核心
        coreAttribute: 0,
        //会心
        criticalStrike: 0,
        //调息
        recovery: 0,
        //专精
        expertise: 0,
        //破甲
        armorPenetration: 0,
        //命中
        accuracy: 0,
        //体
        constitution: 0,
        //生命
        hp: 0
    })
    //-----套装相关------
    const specialAttribute = ref([])
    const suitNumber315 = ref(0)
    const classSchool = ref(['雷青云', '剑青云'])
    const suitOther = ref(0)
    const suitSize1 = ref(0)
    const suitSize2 = ref(0)
    const suitAttribute1 = ref([])
    const suitAttribute2 = ref([])
    //-------end--------
    //基础属性
    const basics = ref({coreAttribute: 1596, criticalStrike: 252, constitution: 639, physicalDefense: 878, magicDefense: 878,})
    //10人噩梦炼血堂护符随机属性
    const randomAttribute1 = ref()
    const randomAttribute2 = ref()
    const sunMoonStarResult = ref([])


    const getPartImage = (name) => {
        const types = {
            '武器': "url('/part-ico/武器.png')",
            '头部': "url('/part-ico/头部.png')",
            '上身': "url('/part-ico/上身.png')",
            '手部': "url('/part-ico/手部.png')",
            '腰部': "url('/part-ico/腰部.png')",
            '脚部': "url('/part-ico/脚部.png')",
            '护符': "url('/part-ico/护符.png')",
            '法印': "url('/part-ico/法印.png')",
            '令牌': "url('/part-ico/令牌.png')",
        }
        return types[name]
    }
    const getInlay1 = (name) => {
        const types = {
            '162气血': "url('/part-ico/162气血.png')",
            '195气血': "url('/part-ico/195气血.png')",
        }
        return types[name]
    }
    const getInlay2 = (name) => {
        const types = {
            '41核心': "url('/part-ico/41核心.png')",
            '49核心': "url('/part-ico/49核心.png')",
        }
        return types[name]
    }
    const getInlay3 = (name) => {
        const types = {
            '12专精': "url('/part-ico/12专精.png')",
            '14专精': "url('/part-ico/14专精.png')",
            '12会心': "url('/part-ico/12会心.png')",
            '14会心': "url('/part-ico/14会心.png')",
            '12命中': "url('/part-ico/12命中.png')",
            '14命中': "url('/part-ico/14命中.png')",
            '12破甲': "url('/part-ico/12破甲.png')",
            '14破甲': "url('/part-ico/14破甲.png')",
            '12调息': "url('/part-ico/12调息.png')",
            '14调息': "url('/part-ico/14调息.png')",
        }
        return types[name]
    }
    const getClassImage = (name) => {
        const types = {
            '青云': "url('/equipment-ico/qingyun_ico.png')",
            '焚香': "url('/equipment-ico/fenxiang_ico.png')",
            '鬼王': "url('/equipment-ico/guiwang_ico.png')",
            '合欢': "url('/equipment-ico/hehuan_ico.png')",
            '灵汐': "url('/equipment-ico/lingxi_ico.png')"
        }
        return types[name]
    }

    const getClassTagType = (buildClass) => {
        const types = {
            '青云': 'primary',  // 蓝色系 #409EFF
            '焚香': 'danger',  // 红色系 #F56C6C
            '鬼王': 'dark',  // 黑色系 #303133
            '合欢': 'purple',  // 紫色系 #8A2BE2
            '灵汐': 'success'  // 绿色系 #67C23A
        }
        return types[buildClass] || 'info'
    }

    const handleLike = async (build) => {
        const user = JSON.parse(localStorage.getItem('user'))
        if (!user) {
            ElMessage.warning('请先登录后再点赞')
            return
        }

        http.post(`/api/equipment-builds/like/${build.id}?userId=${user.id}`).then(res => {
            console.log(res.data.data);
            if (res.data.data) {
                ElMessage.success("点赞成功")
                build.likeCountStatistics++
            } else {
                http.delete(`/api/equipment-builds/like/${build.id}?userId=${user.id}`).then(() => {
                    ElMessage.success("取消点赞成功")
                    build.likeCountStatistics--
                })
            }
        })
    }
    const handleViewDetail = (id) => {
        detailData.value = null
        let equipmentAttribute = {}
        let inlayAttribute = {}
        let loongSpiritAttribute = {}
        let starSpiritAttribute = {}
        result.value = {//物理防御
            physicalDefense: 0,
            //法术防御
            magicDefense: 0,
            //核心
            coreAttribute: 0,
            //会心
            criticalStrike: 0,
            //调息
            recovery: 0,
            //专精
            expertise: 0,
            //破甲
            armorPenetration: 0,
            //命中
            accuracy: 0,
            //体
            constitution: 0,
            //生命
            HP: 0
        }
        http.get('/equipment/builds/' + id).then(res => {
            loading.value = true
            if (res.data.code === 200) {
                if (res.data.data === null) {
                    ElMessage.error("配装方案不存在，请查看其他配装")
                    return
                }
                detailData.value = res.data.data
                const eq = []
                const setF = []
                const ss = JSON.parse(res.data.data.setFusion);
                res.data.data.equipments.forEach((item, index) => {
                    if (item.partType === 6) {
                        eq[index] = item;
                    } else {
                        eq[item.partType] = item;
                    }
                })
                if (ss !== null) {
                    ss.forEach(item => {
                        setF[item.partType] = item;
                    })
                }
                console.log(setF)
                let randomValue = JSON.parse(res.data.data.randomValue)
                let charmSetFusion = JSON.parse(res.data.data.charmSetFusion)
                let galaxyAttribute = JSON.parse(res.data.data.galaxyAttribute)
                randomAttribute1.value = randomValue === null ? {} : randomValue?.attribute1
                randomAttribute2.value = randomValue === null ? {} : randomValue?.attribute2
                detailData.value.equipments = eq
                detailData.value.talismanLevelAttribute = JSON.parse(res.data.data.talismanLevelAttribute);
                detailData.value.starSpirit = JSON.parse(res.data.data.starSpirit);
                detailData.value.setFusion = setF
                detailData.value.charmSetFusion = charmSetFusion === null ? [] : charmSetFusion
                detailData.value.galaxyAttribute = galaxyAttribute === null ? {'0': 0, '1': 0, '2': 0, '3': 0, '4': 0, '5': 0} : galaxyAttribute


                starSpiritAttribute = starSpirit(detailData.value.starSpirit)
                equipmentAttribute = calculateEquipment(detailData?.value.equipments)
                inlayAttribute = inlaySelectChange(detailData?.value.inlays, detailData?.value.equipments)
                loongSpiritAttribute = loongSpiritEnhancedResult(detailData?.value.equipments)
                result.value = applyAttribute(
                    detailData?.value,
                    starSpiritAttribute,
                    equipmentAttribute,
                    inlayAttribute,
                    loongSpiritAttribute
                )
                calculateSuit(detailData.value)
            } else {
                ElMessage.error(res.data.message)
            }
        })
    }

    //计算星魄属性
    const starSpirit = (xingPo) => {
        let attribute = {
            coreAttribute: 0,
            criticalStrike: 0,
            expertise: 0,
            armorPenetration: 0,
            recovery: 0,
            hp: 0
        }
        for (let item in xingPo) {
            attribute.coreAttribute += xingPo[item].coreAttribute
            attribute.hp += xingPo[item].HP
        }
        attribute.criticalStrike = xingPo['青龙'].attribute * 3
        attribute.recovery = xingPo['白虎'].attribute * 3
        attribute.armorPenetration = xingPo['玄武'].attribute * 3
        attribute.expertise = xingPo['朱雀'].attribute * 3
        return attribute
    }
    //计算装备属性总和
    const calculateEquipment = (equipments) => {
        let equipmentTotal = {
            coreAttribute: 0,
            constitution: 0,
            physicalDefense: 0,
            magicDefense: 0,
            criticalStrike: 0,
            recovery: 0,
            expertise: 0,
            armorPenetration: 0,
            accuracy: 0,
        }
        for (let i in randomAttribute1.value) {
            let v = randomAttribute1.value[i]?.value * 1.05 ** 2
            switch (randomAttribute1.value[i]?.type) {
                case 0://会心
                    equipmentTotal.criticalStrike += v
                    break
                case 1://调息
                    equipmentTotal.recovery += v
                    break
                case 2://专精
                    equipmentTotal.expertise += v
                    break
                case 3://破甲
                    equipmentTotal.armorPenetration += v
                    break
                case 4://命中
                    equipmentTotal.accuracy += v
                    break
            }
        }
        for (let i in randomAttribute2.value) {
            let v = randomAttribute2.value[i]?.value * 1.05 ** 2
            switch (randomAttribute2.value[i]?.type) {
                case 0://会心
                    equipmentTotal.criticalStrike += v
                    break
                case 1://调息
                    equipmentTotal.recovery += v
                    break
                case 2://专精
                    equipmentTotal.expertise += v
                    break
                case 3://破甲
                    equipmentTotal.armorPenetration += v
                    break
                case 4://命中
                    equipmentTotal.accuracy += v
                    break
            }
        }
        for (let i in equipments) {
            equipmentTotal.coreAttribute += equipments[i].coreAttribute
            equipmentTotal.constitution += equipments[i].constitution
            equipmentTotal.physicalDefense += equipments[i].physicalDefense
            equipmentTotal.magicDefense += equipments[i].magicDefense
            equipmentTotal.criticalStrike += equipments[i].criticalStrike
            equipmentTotal.recovery += equipments[i].recovery
            equipmentTotal.expertise += equipments[i].expertise
            equipmentTotal.armorPenetration += equipments[i].armorPenetration
            equipmentTotal.accuracy += equipments[i].accuracy
        }
        return equipmentTotal
    }
    //选择灌注，并计算所有灌注符的总属性
    const inlaySelectChange = (inlays, equipments) => {
        let inlayList = []
        inlays.forEach(inlay => {
            let item = {...inlay}
            //则增加灌注属性，这里不用id来判断的原因是，每个职业都有一个世界boss的装备，判断起来太麻烦，所以干脆用名称判断
            //如果上衣是世界boss的
            if (item.partType === 1) {
                if (equipments[1].equipmentName.includes('倏忽无同')) {
                    item.blood = (item.blood * 1.35).toFixed(0)
                }
            }
            //如果头盔是世界boss的
            if (item.partType === 2) {
                if (equipments[2].equipmentName.includes('倏忽无同')) {
                    item.coreAttribute = (item.coreAttribute * 1.2).toFixed(0)
                }
            }
            //如果护腕是世界boss的
            if (item.partType === 3) {
                if (equipments[3].equipmentName.includes('倏忽无同')) {
                    item.criticalStrike = (item.criticalStrike * 1.5).toFixed(0)
                    item.expertise = (item.expertise * 1.5).toFixed(0)
                    item.armorPenetration = (item.armorPenetration * 1.5).toFixed(0)
                    item.recovery = (item.recovery * 1.5).toFixed(0)
                    item.accuracy = (item.accuracy * 1.5).toFixed(0)
                }
            }
            //如果腰带是世界boss的
            if (item.partType === 4) {
                if (equipments[4].equipmentName.includes('倏忽无同')) {
                    item.criticalStrike = (item.criticalStrike * 1.5).toFixed(0)
                    item.expertise = (item.expertise * 1.5).toFixed(0)
                    item.armorPenetration = (item.armorPenetration * 1.5).toFixed(0)
                    item.recovery = (item.recovery * 1.5).toFixed(0)
                    item.accuracy = (item.accuracy * 1.5).toFixed(0)
                }
            }
            inlayList.push(item)
        })
        let inlayTotal = {
            coreAttribute: 0,
            criticalStrike: 0,
            expertise: 0,
            armorPenetration: 0,
            recovery: 0,
            accuracy: 0,
            hp: 0,
        }
        inlayList.forEach(inlay => {
            inlayTotal.coreAttribute += inlay.coreAttribute
            inlayTotal.criticalStrike += inlay.criticalStrike
            inlayTotal.expertise += inlay.expertise
            inlayTotal.armorPenetration += inlay.armorPenetration
            inlayTotal.recovery += inlay.recovery
            inlayTotal.accuracy += inlay.accuracy
            inlayTotal.hp += inlay.blood
        })
        return inlayTotal
    }
    //计算每个首饰龙魂符强化后的额外属性
    const loongSpiritEnhancedResult = (equipments) => {
        /*
        把当前选择龙魂符强化的部位的每个属性数值存放进集合对应的位置中
        如果数值为负数则不计算，只返回数值本身
         */
        let loongSpiritEnhanced = []
        equipments.forEach((item, index) => {
            if (index > 0 && index < 6 && item.qualityLevel >= 315) {
                let count = (335 - item.qualityLevel) / 10
                loongSpiritEnhanced[index] = {
                    coreAttribute: (item.coreAttribute * (1.1 ** count)).toFixed(0) - item.coreAttribute,
                    constitution: item.constitution < 0 ? 0 : (item.constitution * (1.1 ** count)).toFixed(0) - item.constitution,
                    criticalStrike: item.criticalStrike < 0 ? 0 : (item.criticalStrike * (1.1 ** count)).toFixed(0) - item.criticalStrike,
                    recovery: item.recovery < 0 ? 0 : (item.recovery * (1.1 ** count)).toFixed(0) - item.recovery,
                    expertise: item.expertise < 0 ? 0 : (item.expertise * (1.1 ** count)).toFixed(0) - item.expertise,
                    armorPenetration: item.armorPenetration < 0 ? 0 : (item.armorPenetration * (1.1 ** count)).toFixed(0) - item.armorPenetration,
                    accuracy: item.accuracy < 0 ? 0 : (item.accuracy * (1.1 ** count)).toFixed(0) - item.accuracy,
                }
            }
            if (index >= 6 && item.qualityLevel >= 305) {
                loongSpiritEnhanced[index] = {
                    coreAttribute: (item.coreAttribute * (1.05 ** (item.loongSpiritUpgradeCount))).toFixed(0) - item.coreAttribute,
                    constitution: item.constitution < 0 ? 0 : (item.constitution * (1.05 ** (item.loongSpiritUpgradeCount))).toFixed(0) - item.constitution,
                    criticalStrike: item.criticalStrike < 0 ? 0 : (item.criticalStrike * (1.05 ** (item.loongSpiritUpgradeCount))).toFixed(0) - item.criticalStrike,
                    recovery: item.recovery < 0 ? 0 : (item.recovery * (1.05 ** (item.loongSpiritUpgradeCount))).toFixed(0) - item.recovery,
                    expertise: item.expertise < 0 ? 0 : (item.expertise * (1.05 ** (item.loongSpiritUpgradeCount))).toFixed(0) - item.expertise,
                    armorPenetration: item.armorPenetration < 0 ? 0 : (item.armorPenetration * (1.05 ** (item.loongSpiritUpgradeCount))).toFixed(0) - item.armorPenetration,
                    accuracy: item.accuracy < 0 ? 0 : (item.accuracy * (1.05 ** (item.loongSpiritUpgradeCount))).toFixed(0) - item.accuracy,
                }
            }

        })

        let loongSpiritTotal = {
            coreAttribute: 0,
            constitution: 0,
            criticalStrike: 0,
            recovery: 0,
            expertise: 0,
            armorPenetration: 0,
            accuracy: 0,
        }
        loongSpiritEnhanced.forEach(item => {
            loongSpiritTotal.coreAttribute += item.coreAttribute
            loongSpiritTotal.constitution += item.constitution
            loongSpiritTotal.criticalStrike += item.criticalStrike
            loongSpiritTotal.recovery += item.recovery
            loongSpiritTotal.expertise += item.expertise
            loongSpiritTotal.armorPenetration += item.armorPenetration
            loongSpiritTotal.accuracy += item.accuracy
        });
        console.log(loongSpiritTotal)
        return loongSpiritTotal
    }

    //计算最终属性
    const applyAttribute = (detailData, starSpiritAttribute, equipmentTotal, inlay, loongSpiritTotal) => {
        let result = {
            physicalDefense: 0,
            magicDefense: 0,
            coreAttribute: 0,
            criticalStrike: 0,
            recovery: 0,
            expertise: 0,
            armorPenetration: 0,
            accuracy: 0,
            constitution: 0,
            hp: 0
        }
        let hufuDTD = {
            coreAttributeCoefficient: 1,
            criticalStrike: 0,
            recovery: 0,
            expertise: 0,
            armorPenetration: 0,
            hp: 1
        }
        //判断护符是否佩戴了【稀世·度天地】
        if (detailData?.equipments[6] != null && detailData?.equipments[6] !== undefined && detailData?.equipments[6].id === 239
            || detailData?.equipments[7] != null && detailData?.equipments[7] !== undefined && detailData?.equipments[7].id === 239) {
            hufuDTD.coreAttributeCoefficient = 1.01
            hufuDTD.criticalStrike = 39
            hufuDTD.recovery = 39
            hufuDTD.expertise = 39
            hufuDTD.armorPenetration = 39
            hufuDTD.hp = 1.01
        }

        if (detailData?.buildClass === "鬼王" && detailData?.buildSchool === "罡鬼王") {//计算鬼王天书防御
            result.physicalDefense = basics.value.physicalDefense + equipmentTotal.physicalDefense
            result.magicDefense = basics.value.magicDefense + equipmentTotal.magicDefense

            result.physicalDefense = result.physicalDefense * 1.5 + result.physicalDefense * (detailData?.skillTree.defense / 100)
            result.magicDefense = result.magicDefense * 1.5 + result.magicDefense * (detailData?.skillTree.defense / 100)
        } else {
            result.physicalDefense = basics.value.physicalDefense + equipmentTotal.physicalDefense
            result.magicDefense = basics.value.magicDefense + equipmentTotal.magicDefense
        }
        result.coreAttribute = (basics.value.coreAttribute + equipmentTotal.coreAttribute + loongSpiritTotal.coreAttribute +
                currentRealm.value.coreAttribute + inlay.coreAttribute + (detailData?.talisman?.coreAttribute || 0) +
                detailData?.talismanLevelAttribute.coreAttribute + starSpiritAttribute.coreAttribute) *
            hufuDTD.coreAttributeCoefficient
        result.criticalStrike = basics.value.criticalStrike + equipmentTotal.criticalStrike +
            loongSpiritTotal.criticalStrike + inlay.criticalStrike +
            starSpiritAttribute.criticalStrike + (detailData?.talisman?.criticalStrike || 0) +
            hufuDTD.criticalStrike
        result.recovery = equipmentTotal.recovery + loongSpiritTotal.recovery +
            inlay.recovery + starSpiritAttribute.recovery + (detailData?.talisman?.recovery || 0) +
            hufuDTD.recovery
        result.expertise = equipmentTotal.expertise + loongSpiritTotal.expertise +
            inlay.expertise + starSpiritAttribute.expertise + (detailData?.talisman?.expertise || 0) +
            hufuDTD.expertise
        result.armorPenetration = equipmentTotal.armorPenetration + loongSpiritTotal.armorPenetration +
            inlay.armorPenetration + starSpiritAttribute.armorPenetration + (detailData?.talisman?.armorPenetration || 0) + hufuDTD.armorPenetration
        result.accuracy = equipmentTotal.accuracy + loongSpiritTotal.accuracy +
            inlay.accuracy + (detailData?.talisman?.accuracy || 0)
        result.constitution = basics.value.constitution + equipmentTotal.constitution + loongSpiritTotal.constitution + currentRealm.value.constitution
        let hp = detailData?.talismanLevelAttribute.hp === undefined ? detailData?.talismanLevelAttribute.HP : detailData?.talismanLevelAttribute.hp
        result.hp = (result.constitution * 10 + hp + inlay.hp + starSpiritAttribute.hp) * hufuDTD.hp
        console.log(result.hp, result.constitution, detailData?.talismanLevelAttribute.hp, inlay.hp, starSpiritAttribute.hp, hufuDTD.hp)

        if (detailData?.buildClass === "鬼王" && detailData?.buildSchool === "罡鬼王") {
            result.hp = result.hp + (result.hp * 0.3) + (result.hp * (detailData?.skillTree.hp / 100))
        }
        suitNumber315.value = 0
        specialAttribute.value = []
        detailData?.equipments.forEach((item, index) => {
            if (item != null) {
                //把特殊效果放入集合里
                if (item.specialAttribute?.length > 1) {
                    specialAttribute.value.push({type: item.equipmentSlot, content: item.specialAttribute})
                }
                if (detailData?.charmSetFusion[index] != null) {
                    specialAttribute.value.push({type: item.equipmentSlot, content: '【赋能：' + detailData?.charmSetFusion[index].name + '】' + detailData?.charmSetFusion[index].effect})
                }
                if (item.equipmentSource?.includes("桑约·玄套装")) {
                    suitNumber315.value++
                } else if (item.equipmentSource?.includes("桑约·极套装")) {

                }
            }
        })

        //305套装属性
        if (suitNumber315.value >= 2) {
            result.coreAttribute += 180
        }
        if (suitNumber315.value >= 4) {
            //计算套装属性分配给四维中的哪个
            let maxValue = Math.max(result.criticalStrike, result.recovery, result.expertise, result.armorPenetration)
            switch (maxValue) {
                case result.criticalStrike:
                    result.criticalStrike += 195
                    break;
                case result.recovery:
                    result.recovery += 195
                    break;
                case result.expertise:
                    result.expertise += 195
                    break;
                case result.armorPenetration:
                    result.armorPenetration += 195
                    break;
                default:
                    break;
            }
        }

        //判断法印是否佩戴【太初玄元】
        if (detailData?.equipments[8] != null && detailData?.equipments[8] !== undefined && detailData?.equipments[8].equipmentName.includes("太初玄元")) {
            if (result.accuracy > 585) {
                result.accuracy -= 78
            } else {
                result.accuracy += 78
            }
        }
        let maxValue = Math.max(result.criticalStrike, result.recovery, result.expertise, result.armorPenetration)
        let minValue = Math.min(result.criticalStrike, result.recovery, result.expertise, result.armorPenetration)
        //判断令牌是否佩戴【稀世·渡彼岸】
        if (detailData?.equipments[9] != null && detailData?.equipments[9] !== undefined && detailData?.equipments[9].equipmentName.includes("稀世·渡彼岸")) {
            //计算渡彼岸属性分配给哪个
            switch (maxValue) {
                case result.criticalStrike:
                    result.criticalStrike += 190
                    break;
                case result.recovery:
                    result.recovery += 190
                    break;
                case result.expertise:
                    result.expertise += 190
                    break;
                case result.armorPenetration:
                    result.armorPenetration += 190
                    break;
                default:
                    break;
            }
        } else if (detailData?.equipments[9] != null && detailData?.equipments[9] !== undefined && detailData?.equipments[9].equipmentName.includes("乾坤无极")) {
            //判断是否佩戴【乾坤无极】
            switch (minValue) {
                case result.criticalStrike:
                    result.criticalStrike -= 78
                    break;
                case result.recovery:
                    result.recovery -= 78
                    break;
                case result.expertise:
                    result.expertise -= 78
                    break;
                case result.armorPenetration:
                    result.armorPenetration -= 78
                    break;
                default:
                    break;
            }
        }

        let type1 = -1
        let type2 = -1
        if (detailData.equipments[6].equipmentName.includes("旭日凌空") || detailData?.charmSetFusion[6]?.type === 0) {
            type1 = 0
        } else if (detailData.equipments[6].equipmentName.includes("孤月葬魂") || detailData?.charmSetFusion[6]?.type === 1) {
            type1 = 1
        } else if (detailData.equipments[6].equipmentName.includes("星陨离歌") || detailData?.charmSetFusion[6]?.type === 2) {
            type1 = 2
        } else if (detailData.equipments[6].equipmentName.includes("永夜哀歌") || detailData?.charmSetFusion[6]?.type === 3) {
            type1 = 3
        } else if (detailData.equipments[6].equipmentName.includes("混沌归墟") || detailData?.charmSetFusion[6]?.type === 4) {
            type1 = 4
        } else if (detailData.equipments[6].equipmentName.includes("太虚流光") || detailData?.charmSetFusion[6]?.type === 5) {
            type1 = 5
        }
        if (detailData.equipments[7].equipmentName.includes("旭日凌空") || detailData?.charmSetFusion[7]?.type === 0) {
            type2 = 0
        } else if (detailData.equipments[7].equipmentName.includes("孤月葬魂") || detailData?.charmSetFusion[7]?.type === 1) {
            type2 = 1
        } else if (detailData.equipments[7].equipmentName.includes("星陨离歌") || detailData?.charmSetFusion[7]?.type === 2) {
            type2 = 2
        } else if (detailData.equipments[7].equipmentName.includes("永夜哀歌") || detailData?.charmSetFusion[7]?.type === 3) {
            type2 = 3
        } else if (detailData.equipments[7].equipmentName.includes("混沌归墟") || detailData?.charmSetFusion[7]?.type === 4) {
            type2 = 4
        } else if (detailData.equipments[7].equipmentName.includes("太虚流光") || detailData?.charmSetFusion[7]?.type === 5) {
            type2 = 5
        }
        //     {name: "旭日凌空", type: 0, effect: "每带有2点耀日，造成的伤害和治疗增加0.55%"},
        //     {name: "孤月葬魂", type: 1, effect: "每带有2点残月，造成的属性伤害增加0.6%"},
        //     {name: "星陨离歌", type: 2, effect: "每带有2点流星，受到伤害降低0.5%，造成治疗增加0.55%"},
        //     {name: "永夜哀歌", type: 3, effect: "当同时带有曜日、残月和流星属性时，造成的会心伤害和会心治疗增加9%"},
        //     {name: "混沌归墟", type: 4, effect: "当带有的耀日、残月和流星属性中最高值大于17时，增加480点核心属性"},
        //     {name: "太虚流光", type: 5, effect: "每带有200点最高的额外属性（会心、专精、调息和破甲），增加耀日、残月和流星中最高值2.4倍的核心属性"},
        let sun = 0
        let moon = 0
        let star = 0
        for (let i in detailData?.galaxyAttribute) {
            switch (detailData.equipments[i].galaxyType) {
                case 1:
                    sun += detailData?.galaxyAttribute[i]
                    break
                case 2:
                    moon += detailData?.galaxyAttribute[i]
                    break
                case 3:
                    star += detailData?.galaxyAttribute[i]
                    break
                default:
                    break
            }
        }
        let max = Math.max(sun, moon, star)
        console.log('日月星', max, sun, moon, star)
        let sunHarm = 0
        let moonHarm = 0
        let starHarm1 = 0
        let starHarm2 = 0
        sunMoonStarResult.value = []
        switch (type1) {
            case 0://每带有2点耀日，造成的伤害和治疗增加0.55%
                console.log(sun / 2)
                sunHarm = Math.trunc(sun / 2) * 0.55
                sunMoonStarResult.value.push("【旭日凌空】" + sun + "耀日：" + sunHarm.toFixed(2) + "%伤害和治疗")
                break
            case 1://每带有2点残月，造成的属性伤害增加0.6%
                console.log(moon / 2)
                moonHarm = Math.trunc(moon / 2) * 0.6
                sunMoonStarResult.value.push("【孤月葬魂】" + moon + "残月：" + moonHarm.toFixed(2) + "%属性伤害")
                break
            case 2://每带有2点流星，受到伤害降低0.5%，造成治疗增加0.55%
                console.log(star / 2)
                starHarm1 = Math.trunc(star / 2) * 0.5
                starHarm2 = Math.trunc(star / 2) * 0.55
                sunMoonStarResult.value.push("【星陨离歌】" + star + "流星：" + starHarm1.toFixed(2) + "%伤害降低，" + starHarm2.toFixed(2) + "%治疗增加")
                break
            case 3://当同时带有曜日、残月和流星属性时，造成的会心伤害和会心治疗增加9%
                if (sun > 0 && moon > 0 && star > 0) {
                    console.log("已激活")
                    sunMoonStarResult.value.push("【永夜哀歌】会心伤害和会心治疗增加9%")
                }
                break
            case 4://当带有的耀日、残月和流星属性中最高值大于17时，增加480点核心属性。
                if (max > 17) {
                    result.coreAttribute += 480
                    sunMoonStarResult.value.push("【混沌归墟】核心属性增加：480")
                }
                break
            case 5://每带有200点最高的额外属性（会心、专精、调息和破甲），增加耀日、残月和流星中最高值2.4倍的核心属性
                //计算最高属性/200的商
                const quotient = Math.trunc(maxValue / 200)
                //获取日月星中的最大值，并*2.4
                const maxN = max * 2.4
                const res = quotient * maxN
                result.coreAttribute += res
                sunMoonStarResult.value.push("【太虚流光】核心属性增加：" + res.toFixed(0))
                break
            default:
                break
        }
        switch (type2) {
            case 0://每带有2点耀日，造成的伤害和治疗增加0.55%
                console.log(sun / 2)
                sunHarm = Math.trunc(sun / 2) * 0.55
                sunMoonStarResult.value.push("【旭日凌空】" + sun + "耀日：" + sunHarm.toFixed(2) + "%伤害和治疗")
                break
            case 1://每带有2点残月，造成的属性伤害增加0.6%
                console.log(moon / 2)
                moonHarm = Math.trunc(moon / 2) * 0.6
                sunMoonStarResult.value.push("【孤月葬魂】" + moon + "残月：" + moonHarm.toFixed(2) + "%属性伤害")
                break
            case 2://每带有2点流星，受到伤害降低0.5%，造成治疗增加0.55%
                console.log(star / 2)
                starHarm1 = Math.trunc(star / 2) * 0.5
                starHarm2 = Math.trunc(star / 2) * 0.55
                sunMoonStarResult.value.push("【星陨离歌】" + star + "流星：" + starHarm1.toFixed(2) + "%伤害降低，" + starHarm2.toFixed(2) + "%治疗增加")
                break
            case 3://当同时带有曜日、残月和流星属性时，造成的会心伤害和会心治疗增加9%
                if (sun > 0 && moon > 0 && star > 0) {
                    console.log("已激活")
                    sunMoonStarResult.value.push("【永夜哀歌】会心伤害和会心治疗增加9%")
                }
                break
            case 4://当带有的耀日、残月和流星属性中最高值大于17时，增加480点核心属性。
                if (max > 17) {
                    result.coreAttribute += 480
                    sunMoonStarResult.value.push("【混沌归墟】核心属性增加：480")
                }
                break
            case 5://每带有200点最高的额外属性（会心、专精、调息和破甲），增加耀日、残月和流星中最高值2.4倍的核心属性
                //计算最高属性/200的商
                const quotient = Math.trunc(maxValue / 200)
                //获取日月星中的最大值，并*2.4
                const maxN = max * 2.4
                const res = quotient * maxN
                result.coreAttribute += res
                sunMoonStarResult.value.push("【太虚流光】核心属性增加：" + res.toFixed(0))
                break
            default:
                break
        }
        console.log(result)

        return result
    }

    //计算套装
    const calculateSuit = (detailData) => {
        let suitO = 0
        if (detailData?.equipments[6]?.equipmentName.includes("幽海通玄") || detailData?.equipments[7]?.equipmentName.includes("幽海通玄")) {
            suitO++
        }
        if (detailData?.equipments[0]?.equipmentName.includes("九幽锋寒") || (detailData?.equipments[0]?.equipmentName.includes("神兵") && detailData?.equipments[0]?.qualityLevel === 335)) {
            suitO++
        }
        suitOther.value = suitO

        suitSize1.value = 0
        suitSize2.value = 0
        //计算装备套装
        switch (detailData?.buildClass) {
            case "青云":
                classSchool.value = ["雷青云", "剑青云"]
                suitSize1.value = detailData?.equipments.filter(value => value.classSpecialize === "雷青云").length
                suitSize2.value = detailData?.equipments.filter(value => value.classSpecialize === "剑青云").length
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：引雷诀、真霆雷动、神剑御雷真诀造成的伤害提高15%",
                        "4：释放真霆雷动获得1层【纵溢】效果，释放神剑御雷真诀获得3层【纵溢】效果，消耗【纵溢】效果可无视消耗释放一次引雷诀，【雷元爆发】状态下，消耗【纵溢】效果的引雷诀造成伤害提高50%"
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：道剑纵横、穿星造成的伤害提高20%；剑扫六合造成的伤害提高30%",
                        "4：释放剑心通明和寰宇千锋时，分别获得1/2层【凌绝】效果，消耗【凌绝】效果可无视冷却释放一次道剑纵横，通过此效果获得的道剑纵横无法使自身获得无敌效果；道剑纵横使自身获得3秒剑心通明或6秒寰宇千锋效果（取决于自身所习得的秘技）",
                    ]
                }
                console.log(suitSize1.value, suitSize2.value)
                break;
            case "焚香":
                classSchool.value = ["炎焚香", "咒焚香"]
                suitSize1.value = detailData?.equipments.filter(value => value.classSpecialize === "炎焚香").length
                suitSize2.value = detailData?.equipments.filter(value => value.classSpecialize === "咒焚香").length
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：炎龙降世或轰焱的会心率提升15%",
                        "4：释放炎龙印刻后，6秒内自身会心率增加40%",
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：玄阳天律会心率增加30%",
                        "4：每使用一次灵引，玄阳天律冷却减少3秒"
                    ]
                }
                break;
            case "鬼王":
                classSchool.value = ["罡鬼王", "煞鬼王"]
                suitSize1.value = detailData?.equipments.filter(value => value.classSpecialize === "罡鬼王").length
                suitSize2.value = detailData?.equipments.filter(value => value.classSpecialize === "煞鬼王").length
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：追魂斩造成的伤害提高20%，并恢复自身等同于物理攻击的气血",
                        "4：聚灵斩充能层数增加1次，聚灵斩每消耗一层破绽，减少1秒明王降世咒冷却时间"
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：鬼王每秒额外恢复30点魔性",
                        "4：鬼斩、湮魂爪每次命中减少魔性大发、明王降世咒技能0.3秒冷却时间，魔性大发、明王降世咒期间对怪物造成伤害增加25%",
                    ]
                }
                break;
            case "合欢":
                classSchool.value = ["影合欢", "月合欢"]
                suitSize1.value = detailData?.equipments.filter(value => value.classSpecialize === "影合欢").length
                suitSize2.value = detailData?.equipments.filter(value => value.classSpecialize === "月合欢").length
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：拂袖千星的月能消耗提高20点，拂袖千星、拂袖千星·影的伤害提高25%",
                        "4：每次释放影舞，下次影舞、影舞·影伤害提高60%，并获得拂袖千星·暗香"
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：月刃之息伤害提高15%",
                        "4：月无情和月袭的会心率提高8%，并且每释放5次月刃之息获得一个不消耗冷却、不消耗月能的月无情和月袭",
                    ]
                }
                break;
            case "灵汐":
                classSchool.value = ["灵灵汐", "汐灵汐"]
                suitSize1.value = detailData?.equipments.filter(value => value.classSpecialize === "灵灵汐").length
                suitSize2.value = detailData?.equipments.filter(value => value.classSpecialize === "汐灵汐").length
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：对敌人释放甘霖时恢复自身1枚鱼灵；甘霖每次造成伤害时，自身获得2层【怒潮】效果，灵爆会消耗所有【怒潮】效果，每层【怒潮】使敌人额外受到86水属性伤害，此伤害受到自身专精率影响",
                        "4：碎雨和潮歌每次造成伤害时，为自身叠加1层【怒潮】效果；进入战斗时，立刻获得40层【怒潮】效果",
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：甘霖为目标添加【飞鳐守护】效果，使其在下次受到伤害时恢复2532气血",
                        "4：消耗【飞鳐守护】使目标受到自身的气血恢复效果提高10%，持续10秒。"
                    ]
                }
                break;
            default:
                break;
        }

        console.log(detailData?.setFusion)
        let s1 = 0
        let s2 = 0
        //计算贴膜套装
        switch (detailData?.buildClass) {
            case "青云":
                classSchool.value = ["雷青云", "剑青云"]
                s1 = detailData?.setFusion.filter(value => value.type === "雷青云").length
                s2 = detailData?.setFusion.filter(value => value.type === "剑青云").length
                suitSize1.value += s1
                suitSize2.value += s2
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：引雷诀、真霆雷动、神剑御雷真诀造成的伤害提高15%",
                        "4：释放真霆雷动获得1层【纵溢】效果，释放神剑御雷真诀获得3层【纵溢】效果，消耗【纵溢】效果可无视消耗释放一次引雷诀，【雷元爆发】状态下，消耗【纵溢】效果的引雷诀造成伤害提高50%"
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：道剑纵横、穿星造成的伤害提高20%；剑扫六合造成的伤害提高30%",
                        "4：释放剑心通明和寰宇千锋时，分别获得1/2层【凌绝】效果，消耗【凌绝】效果可无视冷却释放一次道剑纵横，通过此效果获得的道剑纵横无法使自身获得无敌效果；道剑纵横使自身获得3秒剑心通明或6秒寰宇千锋效果（取决于自身所习得的秘技）",
                    ]
                }
                console.log(suitSize1.value, suitSize2.value)
                break;
            case "焚香":
                classSchool.value = ["炎焚香", "咒焚香"]
                s1 = detailData?.setFusion.filter(value => value.type === "炎焚香").length
                s2 = detailData?.setFusion.filter(value => value.type === "咒焚香").length
                suitSize1.value += s1
                suitSize2.value += s2
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：炎龙降世或轰焱的会心率提升15%",
                        "4：释放炎龙印刻后，6秒内自身会心率增加40%",
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：玄阳天律会心率增加30%",
                        "4：每使用一次灵引，玄阳天律冷却减少3秒"
                    ]
                }
                break;
            case "鬼王":
                classSchool.value = ["罡鬼王", "煞鬼王"]
                s1 = detailData?.setFusion.filter(value => value.type === "罡鬼王").length
                s2 = detailData?.setFusion.filter(value => value.type === "煞鬼王").length
                suitSize1.value += s1
                suitSize2.value += s2
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：追魂斩造成的伤害提高20%，并恢复自身等同于物理攻击的气血",
                        "4：聚灵斩充能层数增加1次，聚灵斩每消耗一层破绽，减少1秒明王降世咒冷却时间"
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：鬼王每秒额外恢复30点魔性",
                        "4：鬼斩、湮魂爪每次命中减少魔性大发、明王降世咒技能0.3秒冷却时间，魔性大发、明王降世咒期间对怪物造成伤害增加25%",
                    ]
                }
                break;
            case "合欢":
                classSchool.value = ["影合欢", "月合欢"]
                s1 = detailData?.setFusion.filter(value => value.type === "影合欢").length
                s2 = detailData?.setFusion.filter(value => value.type === "月合欢").length
                suitSize1.value += s1
                suitSize2.value += s2
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：拂袖千星的月能消耗提高20点，拂袖千星、拂袖千星·影的伤害提高25%",
                        "4：每次释放影舞，下次影舞、影舞·影伤害提高60%，并获得拂袖千星·暗香"
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：月刃之息伤害提高15%",
                        "4：月无情和月袭的会心率提高8%，并且每释放5次月刃之息获得一个不消耗冷却、不消耗月能的月无情和月袭",
                    ]
                }
                break;
            case "灵汐":
                classSchool.value = ["灵灵汐", "汐灵汐"]
                s1 = detailData?.setFusion.filter(value => value.type === "灵灵汐").length
                s2 = detailData?.setFusion.filter(value => value.type === "汐灵汐").length
                suitSize1.value += s1
                suitSize2.value += s2
                if (suitSize1.value >= 2) {
                    suitAttribute1.value = [
                        "2：对敌人释放甘霖时恢复自身1枚鱼灵；甘霖每次造成伤害时，自身获得2层【怒潮】效果，灵爆会消耗所有【怒潮】效果，每层【怒潮】使敌人额外受到86水属性伤害，此伤害受到自身专精率影响",
                        "4：碎雨和潮歌每次造成伤害时，为自身叠加1层【怒潮】效果；进入战斗时，立刻获得40层【怒潮】效果",
                    ]
                }
                if (suitSize2.value >= 2) {
                    suitAttribute2.value = [
                        "2：甘霖为目标添加【飞鳐守护】效果，使其在下次受到伤害时恢复2532气血",
                        "4：消耗【飞鳐守护】使目标受到自身的气血恢复效果提高10%，持续10秒。"
                    ]
                }
                break;
            default:
                break;
        }

        imageHtml2Canvas()
    }

    handleViewDetail(route.query.id)
    // handleViewDetail(491)

    const imageHtml2Canvas = async () => {
        await nextTick(() => {
            const element = document.getElementById("imageHtml") // 获取DOM元素引用
            const shareImage = document.getElementById("image")
            html2canvas(element).then(canvas => {
                shareImage.innerHTML = ''
                shareImage.appendChild(canvas)
            });
        })

    }
    onMounted(() => {

    })
    return {
        loading,
        goBack,
        getClassTagType,
        handleLike,
        getPartImage,
        getInlay1,
        getInlay2,
        getInlay3,
        getClassImage,
        author,
        selectedBuild,
        detailData,
        result,
        specialAttribute,
        suitNumber315,
        classSchool,
        suitOther,
        suitSize1,
        suitSize2,
        suitAttribute1,
        suitAttribute2,
        randomAttribute1,
        randomAttribute2,
        sunMoonStarResult
    }
}